<template>
  <view class="vip">
    <v-nav-bar :nav-bar="navBar" :top="top" :name="vip.name" />
    <v-swiper :list="vip.swiper" />
    <v-recommend :list="vip.recommend" />
    <v-update :list="vip.update" />
  </view>
</template>

<script>
import NavBar from '../components/vip/NavBar'
import Swiper from '../components/vip/Swiper'
import Recommend from '../components/vip/Recommend'
import Update from '../components/vip/Update'

import base64 from '../../../util/base64'

import { navTabHeight } from '../../../util/platform'
import LastModel from '../../../api/last'
const lastModel = new LastModel()


export default {
  props: ['refresh', 'tab'],
  components: {
    'v-nav-bar': NavBar,
    'v-swiper': Swiper,
    'v-recommend': Recommend,
    'v-update': Update,
  },
  watch: {
    refresh: {
      handler(newTime, oldTime) {
        // console.log(oldTime, newTime, newTime - oldTime)
        if (newTime - oldTime > 1 * 1000 && this.tab.url === '/pages/discount/index') {
          this.$store.dispatch('Uni/set_vip', null).then(() => {})
          this.fetch()
        }
      }
    }
  },
  data() {
    return {
      vip: {
        name: '',
        swiper: [],
        recommend: [],
        update: [],
      },
      // 状态栏与导航栏高度
      navBar: {},
      // 吸顶距离
      // #ifdef H5
      top: -44,
      // #endif
      // #ifdef APP-PLUS || MP-WEIXIN
      top: 0,
      // #endif
    }
  },
  methods: {
    fetch() {
      const cache = this.$store.getters['Uni/vip']
      if (!cache || true) {
        lastModel.vip().then(response => {
          let { data } = response
          data = base64.parse(data)
          // console.log(data)
          this.$store.dispatch('Uni/set_vip', data).then(() => {
            this.vip = data
          })
        })
      } else {
        this.vip = cache
      }
    }
  },
  created() {
    uni.pageScrollTo({
      scrollTop: 0,
      duration: 10
    })
    // 设置导航高度
    this.navBar = navTabHeight()
    this.fetch()
  },
  mounted() {
  },

}
</script>

<style scoped lang="scss">
.vip {
  margin-bottom: -20rpx;
  //padding-bottom: 100rpx;
  padding-bottom: calc(100rpx + env(safe-area-inset-bottom));
  /* #ifdef H5 */
  padding-bottom: 20rpx;
  /* #endif */
  background: $vip_color;
}
</style>
